<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Event</title>
  <!-- 如果是引入 icon 图标库 可以用defer -->
</head>

<body>
  <form id="form">
    <button type="submit">提交</button>
  </form>

  <div id="l1">
    <div id="l2">
      <button id="l3">点击</button>
    </div>
  </div>

  <ul id="ul">
    <li data-index="0">
      <button>点击一下</button>
    </li>
    <li data-index="1">
      <button>点击一下</button>
    </li>
    <li data-index="2">
      <button>点击一下</button>
    </li>
    <li data-index="3">
      <button>点击一下</button>
    </li>
    <li data-index="4">
      <button>点击一下</button>
    </li>
    <li data-index="5">
      <button>点击一下</button>
    </li>
  </ul>

  <script src="./events.js"></script>
  <script src="./events-remove.js"></script>
  <script src="./events-bubble.js"></script>
  <script src="./events-delegate.js"></script>
</body>

</html>